<extend name="template/base_index" />

<block name="area_header">

    <link rel="stylesheet" href="__CSS__/style.css">
</block>

<block name="area_body">
    <div class="weui_search_bar" id="search_bar">
        <form class="weui_search_outer" action="{:U('index/index')}" method="post">
            <div class="weui_search_inner">
                <i class="weui_icon_search"></i>
                <input type="text" class="weui_search_input" id="search_input" placeholder="搜索" name="name" required/>
                <a href="javascript:" class="weui_icon_clear" id="search_clear"></a>
            </div>
            <label for="search_input" class="weui_search_text" id="search_text">
                <i class="weui_icon_search"></i>
                <span>搜索</span>
            </label>
        </form>
        <a href="javascript:" class="weui_search_cancel" id="search_cancel">取消</a>
    </div>

    <div class="img-content">
        <div class="swiper-container">
            <div class="swiper-wrapper">
                <volist name="banners" id="banner">
                    <div class="swiper-slide"><a href="{$banner['url']}"><img src="{$banner['img']}" width="100%"/></a></div>
                </volist>
            </div>
                <div class="swiper-pagination"></div>
        </div>
        <div class="img-tab">
            <div><a href="{:U('index/index',array('pid' => '2'))}"><img src="__IMG__/riyong.png" width="50px" height="50px"/><span class="index-category">日化</span></a></div>
            <div><a href="{:U('index/index',array('pid' => '6'))}"><img src="__IMG__/prbj.png" width="50px" height="50px"/><span class="index-category">哺乳保健</span></a></div>
            <div><a href="{:U('index/index',array('pid' => '8'))}"><img src="__IMG__/yiwu.png" width="50px" height="50px"/><span class="index-category">衣物</span></a></div>
            <div><a href="{:U('index/index',array('pid' => '12'))}"><img src="__IMG__/mqt.png" width="50px" height="50px"/><span class="index-category">Mother其它</span></a></div>
            <div><a href="{:U('index/index',array('pid' => '5'))}"><img src="__IMG__/nf.png" width="50px" height="50px"/><span class="index-category">奶粉</span></a></div>
            <div><a href="{:U('index/index',array('pid' => '13'))}"><img src="__IMG__/nbs.png" width="50px" height="50px"/><span class="index-category">纸尿裤</span></a></div>
            <div><a href="{:U('index/index',array('pid' => '14'))}"><img src="__IMG__/wygj.png" width="50px" height="50px"/><span class="index-category">喂养工具</span></a></div>
            <div><a href="{:U('index/index',array('pid' => '15'))}"><img src="__IMG__/bqt.png" width="50px" height="50px"/><span class="index-category">Baby其它</span></a></div>
        </div>
    </div>
    <div class="main-content" id="content">
        <volist name="product" id = 'vo'>
            <div class="good-content">
                <div class="good-top">
                    <div class="good-userimg"><img src="{$vo['avatar']}" width="50px" height="50px"></div>
                    <div class="good-name"><span class="good-sname">{$vo['nickname']}</span><br/><span class="good-time">{$vo['lasttime']}</span></div>
                    <div class="good-price"><i class="fa fa-jpy"></i><span>{$vo['price']}</span><br><span class="quantity">库存:{$vo['quantity']}</span></div>
                </div>
                <a class="good-main" href="{:U('index/good_detail',array('id' => $vo['id']))}">
                    <div class="good-mtop">{$vo['name']}</div>
                    <div class="good-intr"><p>{$vo['synopsis']}</div>
                    <div class="good-img">
                        <volist name="vo['imglist']" id = 'img'>
                            <notempty name="img['path']"><div class="good-img-list"><img src="http://muyin.8raw.com/api.php/picture/index?id={$img['id']}&size=160"></div></notempty>
                        </volist>
                    </div>
                </a>
            </div>
        </volist>
    </div>
    <div class="footermenu">
        <ul>
            <li><center><a href="{:U('Home/Index/index')}"><img src="__IMG__/indeximg.png" width="25px" height="25px"><p>首页</p></a></center></li>
            <li><center><a href="{:U('Home/Ps/index')}"><img src="__IMG__/zhongchou.png" width="25px" height="25px"><p>育儿知识</p></a></center></li>
            <li><center><a href="{:U('Home/User/add_good')}" class="add_good"><img src="__IMG__/addgood.png" width="20px" height="20px"><p>发布</p></a></center></li>
            <li><center><a href="{:U('Home/Group/index')}"><img src="__IMG__/pintuan.png" width="25px" height="25px"><p>拼团</p></a></center></li>
            <li><center><a href="{:U('Home/UserCenter/index')}"><img src="__IMG__/userimg.png" width="25px" height="25px"><p>个人中心</p></a></center></li>

        </ul>
    </div>
    <!--隐藏的页码-->
    <input type="hidden" value="1" id="page"/>
    <input type="hidden" value="{$name}" id="name">
    <input type="hidden" value="{$pid}" id="pid"><!--分类隐藏-->
    <div class="weui-infinite-scroll">
        <div class="infinite-preloader"></div><!-- 菊花 -->
        正在加载... <!-- 文案，可以自行修改 -->
    </div>
    <script src="__JS__/jquery-weui.min.js"></script>
    <script type='text/javascript' src='__JS__/swiper.js' charset='utf-8'></script>
    <script>
        $(".swiper-container").swiper({
            loop: true,
            autoplay: 3000
        });
        $(function() {
            $(document.body).infinite(100);
            var loading = false;
            $(document.body).infinite().on("infinite", function () {
                $('.weui-infinite-scroll').css('display','block');
                if (loading) return;
                loading = true;
                setTimeout(function () {
                    var page = parseInt($("#page").val()) + 1;
                    var like = $('#name').val();
                    var pid = $('#pid').val();
                    $.get("{:U('index/index')}",{curpage:page,name:like,pid:pid}, function(result){
                       if(result){
                           $("#content").append(result);
                           $('#page').val(page);
                       }else{
                           $('.weui-infinite-scroll').html("<span class='lastfinally'>没了 等您来发布哦</span>");
                       }
                        loading = false;
                    });   //模拟延迟
                }, 1500);
            });
        })
    </script>
</block>
